<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	xmlns:pe="http://primefaces.org/ui/extensions">

<h:head>
	<h:outputStylesheet library="css" name="default.css" />
	<h:outputStylesheet library="css" name="imagens.css" />
</h:head>

<ui:composition template="#{animalFaces.nomeTemplate}">

	<ui:define name="content">
		<h:form id="formAnimal">
			<p:growl id="mensagens" life="#{msg.time_stick}" />

			<p:panel id="painel" >
				<f:facet name="header">
					<div align="left"><h:outputText value="Animal" styleClass="tituloPainelInterno"/></div>
				</f:facet>
			
				<p:spacer height="2px" />
				
				<p:panel id="painelBusca" header="Pesquisar">
					<f:facet name="header">
						<div align="left"><h:outputText value="Pesquisar" styleClass="tituloPainelInterno"/></div>
					</f:facet>

					<h:outputText value="Animal " />
					<p:inputText value="#{animalFaces.animalBusca}" />
					
					<p:commandButton value="Buscar" id="buscaAnimal" 
						actionListener="#{animalFaces.buscarAnimal()}" update=":formAnimal:tabelaAnimal"
						icon="imgPesquisaBasica" style="float:right"
					/>
					<p:tooltip value="Buscar animais" for="buscaAnimal" styleClass="textoToolTip"/>
				</p:panel>
				
				<p:spacer height="2px" />
				
				<p:dataTable value="#{animalFaces.listaAnimal}" var="item" id="tabelaAnimal" 
					emptyMessage=" " styleClass="tabelaCompleta" 
					rowStyleClass="#{empty rowIx or rowIx mod 2 ne 0 ? 'even-row' : 'odd-row'}" rowIndexVar="rowIx"
					>
					
					<f:facet name="header">
						<div align="left"><h:outputText value="Animais" styleClass="tituloPainelInternoComBotao"/></div>
						<div align="right">
            				<p:commandButton value="Novo" actionListener="#{animalFaces.prepararAdicionar()}"  id="novoAnimal"
								icon="imgAdicionar" update=":formAnimal:dialogAnimal"
							/>
						<p:tooltip value="Adicionar animal" for="novoAnimal" styleClass="textoToolTip"/>
						</div>
					</f:facet>
					
					<p:column headerText="Nome">
						<h:outputText value="#{item.nome}" />
					</p:column>
					<p:column headerText="Proprietário">
						<h:outputText value="#{item.proprietario.nome}" />
					</p:column>
					<p:column headerText="Espécie">
						<h:outputText value="#{item.especie.especie}" />
					</p:column>
					<p:column headerText="Raça">
						<h:outputText value="#{item.raca.nome}" />
					</p:column>
					<p:column headerText="Castrado" style="text-align:center">
						<p:selectBooleanCheckbox value="#{item.castrado}" disabled="true"/>
					</p:column>

					<p:column headerText="Opções" width="10%">
							<p:commandLink styleClass="ui-icon ui-icon-pencil" 
									actionListener="#{animalFaces.selecionarRegistro(item.id, true, false)}"
									update=":formAnimal:dialogAnimal"
									title="Editar" style="float:left;"
									/>
	
							<p:commandLink styleClass="ui-icon ui-icon-close" 
									actionListener="#{animalFaces.selecionarRegistro(item.id, false, false)}"
									update=":formAnimal:dialogExcluir"
									title="Excluir" style="float:left;"
									/>

							<p:commandLink styleClass="ui-icon ui-icon-arrowstop-1-s" 
									actionListener="#{animalFaces.selecionarNoDialog(item)}" rendered="#{animalFaces.popup}" />
					</p:column>
					
				</p:dataTable>
			</p:panel>

			<p:dialog header="Campos Animal" widgetVar="dialogAnimal" id="dialogAnimal" 
					modal="true" resizable="false" closeOnEscape="true" >
					
					<h:panelGrid columns="3" id="painelInterno" >
						
						<h:outputText value="Nome" />
						<p:inputText value="#{animalFaces.animal.nome}" id="nome" />
						<h:outputText value="" />
						
						<h:outputText value="Castrado" />
						<p:selectBooleanCheckbox value="#{animalFaces.animal.castrado}"/>
						<h:outputText value="" />
							
						<h:outputText value="Data Nascimento" />
						<p:calendar value="#{animalFaces.animal.dataNascimento}" 
							pattern="#{msg.masc_dataSemHora}" locale="#{msg.locale_calendar}" timeZone="#{msg.local_timezone}"
							showOn="button" navigator="true" yearRange="c-25:c+2" showButtonPanel="true" 
						>
						<p:ajax event="dateSelect" listener="#{animalFaces.calcularAnosMeses()}" update="anos meses dias"/>
						</p:calendar>
						<h:outputText value="" />

						<h:outputText value="Anos" />
						<p:inputText value="#{animalFaces.animal.ano}" id="anos"/>
						<h:outputText value="" />
						
						<h:outputText value="Meses" />
						<p:inputText value="#{animalFaces.animal.meses}" id="meses"/>
						<h:outputText value="" />

						<h:outputText value="Dias" />
						<p:inputText value="#{animalFaces.animal.dias}" id="dias"/>
						<h:outputText value="" />
						
						<h:outputText value="Espécie" />
						<p:autoComplete value="#{animalFaces.animal.especie}" 
     								completeMethod="#{especieFaces.autoComplete}"
                  					var="entidade" itemLabel="#{entidade.especie}" itemValue="#{entidade}" converter="converterGeral" 
                  					forceSelection="true" id="esp" >
              				</p:autoComplete>
						
              			<h:outputText value="" rendered="#{animalFaces.popup}"/>
						<p:commandLink styleClass="ui-icon ui-icon-search" disabled="#{animalFaces.proprietario != null}" 
							rendered="#{!animalFaces.popup}"
       						actionListener="#{animalFaces.selecionarEspecie()}" title="Selecionar Espécie">
							<p:ajax event="dialogReturn" listener="#{animalFaces.retornoEspecie}" update="esp"/>
						</p:commandLink>

						<h:outputText value="Pelagem" />
						<p:inputText value="#{animalFaces.animal.pelagem}" />
						<h:outputText value="" />

						<h:outputText value="Proprietário" />
						<p:autoComplete value="#{animalFaces.animal.proprietario}" 
   								completeMethod="#{proprietarioFaces.autoComplete}"
               					var="entidade" itemLabel="#{entidade.nome}" itemValue="#{entidade}" converter="converterGeral" 
               					forceSelection="true" id="prop" >
           				</p:autoComplete>
           				
              			<h:outputText value="" rendered="#{animalFaces.popup}"/>
  						<p:commandLink styleClass="ui-icon ui-icon-search" disabled="#{animalFaces.proprietario != null}" rendered="#{!animalFaces.popup}"
       						actionListener="#{proprietarioFaces.selecionarProprietario()}" title="Selecionar Proprietario">
							<p:ajax event="dialogReturn" listener="#{animalFaces.retornoProprietario}" update="prop"/>
						</p:commandLink>

						<h:outputText value="Raça" />
						<p:autoComplete value="#{animalFaces.animal.raca}" id="rac" 
   								completeMethod="#{racaFaces.autoComplete}"
               					var="entidade" itemLabel="#{entidade.nome}" itemValue="#{entidade}" converter="converterGeral" 
               					forceSelection="true"  >
           				</p:autoComplete>
           				
              			<h:outputText value="" rendered="#{animalFaces.popup}"/>
						<p:commandLink styleClass="ui-icon ui-icon-search" disabled="#{animalFaces.proprietario != null}" rendered="#{!animalFaces.popup}"
       						actionListener="#{racaFaces.exibirDialogRaca()}" title="Selecionar Raça">
							<p:ajax event="dialogReturn" listener="#{animalFaces.retornoRaca}" update="rac"/>
						</p:commandLink>
						
						<h:outputText value="Sexo" />
						<p:selectOneMenu value="#{animalFaces.animal.sexo}" style="width:84%">
							<f:selectItems value="#{animalFaces.listaSexo}" var="sexo" 
								itemValue="#{sexo}" itemLabel="#{sexo.sexo}"/>
						</p:selectOneMenu>
						<h:outputText value="" />
							
						<h:outputText value="Porte" />
						<p:selectOneMenu value="#{animalFaces.animal.porte}" style="width:84%">
							<f:selectItems value="#{animalFaces.listaPorte}" var="porte" 
								itemValue="#{porte}" itemLabel="#{porte.porte}"/>
						</p:selectOneMenu>
						<h:outputText value="" />
							
						
						<h:outputText value="Data Óbito" />
						<p:calendar value="#{animalFaces.animal.dataFalecimento}" 
							pattern="#{msg.masc_dataSemHora}" locale="#{msg.locale_calendar}" timeZone="#{msg.local_timezone}"
							showOn="button" navigator="true" yearRange="c-1:c+1" showButtonPanel="true" >
						<p:ajax event="dateSelect" listener="#{animalFaces.calcularAnosMeses()}" update="anos meses dias"/>
						</p:calendar> 
						<h:outputText value="" />
						
						<h:outputText value="" />
						<p:commandButton value="Adicionar" actionListener="#{animalFaces.adicionar()}" 
										title="Adicionar Animal" icon="imgAdicionar"
										update="mensagens :formAnimal:tabelaAnimal"
										rendered="#{animalFaces.animal.id == null}"
						/>
						
						<p:commandButton value="Salvar" actionListener="#{animalFaces.editar()}" 
										title="Editar Animal" icon="imgSalvar"
										update="mensagens :formAnimal:tabelaAnimal" 
										rendered="#{animalFaces.animal.id != null}"
						/>
					</h:panelGrid>
					<p:tooltip value="Digite 3 letras para buscar a espécie." for="esp"/>
					<p:tooltip value="Digite 3 letras para buscar a raça." for="rac"/>
      				<p:tooltip value="Digite 3 letras para buscar o proprietário." for="prop"/>
					
			</p:dialog>
			
			<p:dialog widgetVar="dialogExcluir" id="dialogExcluir" header="Confirmar Exclusão" 
					modal="true" resizable="false" closeOnEscape="true">
				<h:outputText value="Confirma a exclusão da Animal " /> 
				<br />
				<h:outputText value="#{animalFaces.animal.nome} ?" />
				<br />
				<p:commandButton value="Excluir" actionListener="#{animalFaces.remover()}" 
				update="mensagens :formAnimal:tabelaAnimal" />
			</p:dialog>

		</h:form>
	</ui:define>
</ui:composition>
</html>